<template>
	<view class="mainPage whitePage" :style="{'padding-top': `${$store.state.safeArea.top || 0}px`, 'padding-bottom': `${$store.state.safeArea.bottom || 0}px`}">
		<public-head :title="title" shadow></public-head>
		<view class="box">
			<view class="title">
				{{articleInfo.title}}
			</view>
			<view class="box1">
				<view class="liulan">
					{{articleInfo.browse}}浏览量
				</view>
				<view class="time">
					{{articleInfo.user_name}}
				</view>
			</view>
			
			<view class="box2">
				<rich-text :nodes="articleInfo.content"></rich-text>
			</view>
			
			<view class="box3">
				发布于{{articleInfo.time}}
			</view>
		</view>
	</view>
</template>

<script>
	var that
	import publicHead from "@/components/publicHead/publicHead.vue"
	export default {
		components: {
			publicHead
		},
		data() {
			return {
				title: '文章详情',
				articleInfo: {}
			}
		},
		onLoad(options) {
			that=this
			console.log(options.articleId,99999)
			that.$postAjax1('PetDoctor_article_content',{   //https://ask.suoweilai.com/PetDoctor_article_content  医生端-文章中心 - 文章中心-文章内容页面
					article_id:options.articleId
				},function(data){
					console.log(data.data.data,9999)
					data.data.data[0].content=data.data.data[0].content.replace(/\<img/gi, '<img style="width:100%;height:auto" ')
					that.articleInfo=data.data.data[0]
			})
		},
		methods: {
		}
	}
</script>

<style scoped lang="scss">
.box{
	padding: 0 32rpx;
	.title{
		font-size: 32rpx;
		font-weight: 500;
		color: #242424;
		line-height: 44rpx;
		padding: 20rpx 0 24rpx;
	}
	.box1{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 24rpx;
		.liulan{
			font-size: 24rpx;
			font-weight: 400;
			color: #9B9B9B;
			line-height: 34rpx;
		}
		.time{
			font-size: 26rpx;
			font-weight: 400;
			color: #AAAAAA;
			line-height: 36rpx;
		}
	}
	
	.box2{
		image{
			width: 100%;
		}
	}
	.box3{
		margin-top: 100rpx;
		margin-bottom: 100rpx;
		text-align: right;
		font-size: 28rpx;
		font-weight: 400;
		color: #9B9B9B;
		line-height: 40rpx;
	}
}
</style>
